<template>
  <a-card :bordered='false' v-show='isRelClassSubjectTeacherListCompShow'>

    <!-- 操作按钮区域 -->
    <div class='table-operator'>
      <a-button @click='handleAdd' type='primary' icon='plus'>新增</a-button>
      <a-dropdown v-if='selectedRowKeys.length > 0'>
        <a-menu slot='overlay'>
          <a-menu-item key='1' @click='batchDel'>
            <a-icon type='delete' />
            删除
          </a-menu-item>
        </a-menu>
        <a-button style='margin-left: 8px'> 批量操作
          <a-icon type='down' />
        </a-button>
      </a-dropdown>
      <template>
        <span style="float:right;">
          <a @click="searchQuery()"><a-icon type="sync" />刷新</a>
          <a-divider type="vertical" />
          <a-button v-print="'#datatable'" ghost type="primary">打印</a-button>
        </span>
      </template>
    </div>

    <!-- table区域-begin -->
    <div>

      <j-vxe-table
        ref='vTable'
        bordered
        row-number
        row-selection
        keep-source
        :columns='columns'
        :dataSource='dataSource'
        :pagination='ipagination'
        :linkage-config='linkageConfig'
        @pageChange='handlePageChange'
        @edit-closed='handleEditClosed'
      >
      <span slot='action' slot-scope='text, record'>
          <a @click='handleEdit(record)'>编辑</a>
          <a-divider type='vertical' />
          <a-dropdown>
            <a class='ant-dropdown-link'>更多 <a-icon type='down' /></a>
            <a-menu slot='overlay'>
              <a-menu-item>
                <a @click='handleDetail(record)'>详情</a>
              </a-menu-item>
              <a-menu-item>
                <a-popconfirm title='确定删除吗?' @confirm='() => handleDelete(record.id)'>
                  <a>删除</a>
                </a-popconfirm>
              </a-menu-item>
            </a-menu>
          </a-dropdown>
        </span>
      </j-vxe-table>
    </div>

    <rel-class-subject-teacher-modal ref='modalForm' @ok='modalFormOk'></rel-class-subject-teacher-modal>
  </a-card>
</template>

<script>

import '@/assets/less/TableExpand.less'
import { mixinDevice } from '@/utils/mixin'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import RelClassSubjectTeacherModal from './modules/RelClassSubjectTeacherModal'
import { JVXETypes } from '@/components/jeecg/JVxeTable'
import { getAction, putAction } from '@api/manage'

export default {
  name: 'RelClassSubjectTeacherListComp',
  mixins: [JeecgListMixin, mixinDevice],
  components: {
    RelClassSubjectTeacherModal
  },
  props: {
    isRelClassSubjectTeacherListCompShow: false,
    teacherId: {
      type: String,
      default: ''
    },
    classId: {
      type: String,
      default: ''
    }
  },
  watch: {
    teacherId: {
      immediate: true,
      handler() {
        if(this.teacherId){
          this.queryParam.teacherId = this.teacherId
          this.loadData()
          console.log('teacherId 老師于班級關係发生变化了我刷新了下页面')
        }
      }
    },
    classId: {
      immediate: true,
      handler() {
        if(this.classId) {
          this.queryParam.classId = this.classId
          this.loadData()
          console.log('classId 老師于班級關係发生变化了我刷新了下页面')
        }
      }
    },
    dataSource: {
      immediate: true,
      handler() {
        let returnClassId = ''
        let returnSubjectId = ''
        let returnClassroomId = ''
        this.dataSource.forEach(item => {
          returnSubjectId += item.subjectId + ','
          returnClassId += item.classId + ','
          returnClassroomId += item.classroomId + ','
        })
        this.$bus.$emit('isAchClassAchievementExamScoreListylvCompShow', {
          returnClassId: returnClassId,
          returnSubjectId: returnSubjectId
        })
        this.$bus.$emit('isAchClassAchievementExamScoreListCompShow', {
          returnClassId: returnClassId,
          returnSubjectId: returnSubjectId
        })
        this.$bus.$emit('isAchClassSubjectScoreListCompShow', {
          returnClassId: returnClassId,
          returnSubjectId: returnSubjectId
        })
        this.$bus.$emit('isAchClassSubjectProjScoreListCompShow', {
          returnClassId: returnClassId,
          returnSubjectId: returnSubjectId
        })
        this.$bus.$emit('isFacClassroomListShow', {
          returnClassroomId: returnClassroomId
        })

      }
    }
  },
  data() {
    return {
      description: 'rel_class_subject_teacher管理页面',
      linkageConfig: [
        // 可配置多个联动
        { requestData: this.loadMenu, key: 'subjectId_dictText' }
      ],
      // 表头
      columns: [
        {
          title: '班级',
          align: 'center',
          width: 300,
          key: 'classId_dictText'
          // type: JVXETypes.input
        },
        {
          title: '科目',
          align: 'center',
          width: 300,
          key: 'subjectId_dictText',
          type: JVXETypes.select,
          // dictCode: 'cou_subject,subject_name,id'
          linkageKey: 'teacherId_dictText'
        },
        {
          title: '任课教师',
          align: 'center',
          width: 300,
          key: 'teacherId_dictText',
          type: JVXETypes.select
        },
        {
          title: '教室场地',
          align: 'center',
          width: 300,
          key: 'classroomId_dictText'
          // type: JVXETypes.selectMultiple
        }
        // {
        //   title: '操作',
        //   key: 'action',
        //   align: 'center',
        //   width: 147,
        //   scopedSlots: { customRender: 'action' }
        // }
      ],
      url: {
        list: '/rel_class_subject_teacher/relClassSubjectTeacher/list',
        edit: '/rel_class_subject_teacher/relClassSubjectTeacher/edit',
        delete: '/rel_class_subject_teacher/relClassSubjectTeacher/delete',
        deleteBatch: '/rel_class_subject_teacher/relClassSubjectTeacher/deleteBatch',
        exportXlsUrl: '/rel_class_subject_teacher/relClassSubjectTeacher/exportXls',
        importExcelUrl: 'rel_class_subject_teacher/relClassSubjectTeacher/importExcel',
        queryTeacherBySubject: '/rel_teacher_subject/relTeacherSubject/queryTeacherListBySubject',
        queryClassUrl: '/classes/couClass/queryByGradeId'
      },
      superFieldList: [],
      pagination: {},
      teacherList: [],
      classList: [],
      subjectList: [],
      buildingList: [],
      classroomList: [],
      selectType: 'radioButtonNew',
      selectTypeKuang: 'radioButtonNewKuang',
      selectMultiType: 'checkbox',
      isPinYin: false,
      //查询条件联动部分定义
      queryParamSelect: {},
      disableMixinCreated: true,
    }
  },
  created() {
  },
  computed: {
    importExcelUrl: function() {
      return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`
    }
  },
  mounted() {
  },
  methods: {
    handlePageChange(event) {
      // 重新赋值
      this.pagination.current = event.current
      this.pagination.pageSize = event.pageSize
      // 查询数据
      this.loadData()
    },
    handleEditClosed(event) {
      let row = event.row
      console.log(row)
      let params = {
        id: row.id,
        subjectId: row.subjectId_dictText,
        teacherId: row.teacherId_dictText
      }
      // console.log(params)
      putAction(this.url.edit, params).then(res => {
        if (res.success) {
          this.$message.success('保存成功')
        } else {
          this.$message.warning('保存失败')
        }
      })
    }
  }
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>